<template>
	<view class="mainbgc">
		<view class="mainpadding">
			<view class="mainpadding ffffff">
				<view class="font hei_color" style="font-size: 34rpx;">{{info.question}}</view>
				<view class="" style="margin-top: 20rpx;">
					<text class="text28">考情：</text>
					<text class="jiexi">{{info.schools||'暂无'}}</text>
				</view>
				<view class="box margin_top flexcenter">
					<image src="../../static/image/system/jiesuo.png" v-if="typeLeft==1"></image>
					<image :src="info.quesimage" mode="widthFix" v-if="typeLeft==2"></image>
					<image :src="info.anwserimage" mode="widthFix" v-if="typeLeft==3||typeRight==2"></image>
				</view>
				<view class="flexaround margin_top4">
					<view>
						<view class="hint" v-if="typeLeft==1" @click="typeLeft=2">提示一下</view>
						<view class="hint" v-else-if="typeLeft==2" @click="typeLeft=3,typeRight=2">没想起来</view>
						<view class="hint" v-else @click="goXuanzeti">去刷题</view>
					</view>
					<view>
						<view class="answer" v-if="typeRight==1" @click="typeRight=2,typeLeft=3">记得答案</view>
						<view class="answer" v-else @click="next">下一个考点</view>
					</view>
				</view>
			</view>
		</view>
		<u-modal :show="show" :content='content' :showCancelButton="true" @confirm="confirm" @cancel="cancel"
			confirmColor="#080808">
			<view class="text study">该分类下的知识点已全部学习</view>
		</u-modal>
	</view>
</template>

<script>
	const httpRequest = require("@/common/httpRequest.js")
	export default {
		data() {
			return {
				show: false,
				id: "",
				info: {},
				typeLeft: 1,
				typeRight: 1,
				page: 1,
				pagesize: 10,
				headline_id: "",
				type: "",
				list: {
					data: []
				},
				newIndex: "", //当前题目的索引
			}
		},
		onLoad(options) {
			this.id = options.id
			this.headline_id = options.headline_id
			this.type = options.type
			uni.setNavigationBarTitle({
				title: options.name
			})
			this.init()
			this.getList()

		},
		methods: {
			init() {
				let _this = this;
				httpRequest.request('/api/quizz/detail', 'POST', {
					id: this.id
				}).then(res => {
					if (res.code == 1) {
						_this.info = res.data
						_this.info.quesimage = this.$imgUrl + _this.info.quesimage
						_this.info.anwserimage = this.$imgUrl + _this.info.anwserimage
					} else {
						httpRequest.toast(res.msg);
					}
				})
			},
			getList(isPage, page) {
				let _this = this;
				httpRequest.request('/api/quizz/lists', 'POST', {
					// page: page || 1,
					// pagesize: this.pagesize,
					headline_id: this.headline_id,
					type: this.type
				}).then(res => {
					if (res.code == 1) {
						// let resList = res.data;
						// let dataList = _this.list;
						// if (isPage == true) {
						// 	_this.list.data = dataList.data.concat(resList.data);
						// 	console.log(_this.list.data, 'newList')
						// } else {
						// 	_this.list = resList
						// 	_this.list.data = resList.data;
						// }
						_this.list.data = res.data
						_this.newIndex = _this.list.data.findIndex(item => {
							return item.id == _this.id
						})
					} else {
						httpRequest.toast(res.msg);
					}
				})
			},
			next() {
				if (this.newIndex == this.list.data.length - 1) {
					this.show = true
					return false
				}
				let _this = this;
				httpRequest.request('/api/quizz/add', 'POST', {
					quizz_id: this.id,
					option_id: 0
				}).then(res => {
					if (res.code == 1) {

					} else {
						httpRequest.toast(res.msg);
					}
				})
				this.newIndex++
				this.typeLeft = 1
				this.typeRight = 1
				this.id = this.list.data[this.newIndex].id
				this.init()
			},
			cancel() {
				let _this = this;
				httpRequest.request('/api/quizz/add', 'POST', {
					quizz_id: this.id,
					option_id: 0
				}).then(res => {
					if (res.code == 1) {

					} else {
						httpRequest.toast(res.msg);
					}
				})
				this.show = false
			},
			confirm() {
				let _this = this;
				httpRequest.request('/api/quizz/add', 'POST', {
					quizz_id: this.id,
					option_id: 0
				}).then(res => {
					if (res.code == 1) {

					} else {
						httpRequest.toast(res.msg);
					}
				})
				this.show = false
				uni.navigateBack(2)
			},
			goXuanzeti() {
				uni.redirectTo({
					url: "/pages/homepage/xuanzeti?type=2&id=" + this.headline_id
				})
			},
		}
	}
</script>

<style>
	.text28 {
		font-size: 28rpx;
		font-family: PingFang SC-Medium, PingFang SC;
		font-weight: 500;
		color: rgba(220, 180, 144, 1);
	}

	.jiexi {
		font-size: 28rpx;
		font-family: PingFang SC-Medium, PingFang SC;
		font-weight: 500;
		color: rgba(102, 102, 102, 1);
		line-height: 40rpx;
	}

	.study {
		font-size: 32rpx;
		font-family: PingFang SC-Heavy, PingFang SC;
		font-weight: 800;
		color: #000000;
		padding: 70rpx 0rpx;
	}

	.box {
		padding: 20rpx 20rpx;
		background: #F2F2F2;
	}

	.answer {
		background: #DCB490;
		border-radius: 13rpx 13rpx 13rpx 13rpx;
		padding: 21rpx 67rpx;
		color: #fff;
		font-size: 32rpx;
		font-weight: 500;
	}

	.hint {
		background: rgba(220, 180, 144, 0.1);
		border-radius: 13rpx 13rpx 13rpx 13rpx;
		opacity: 1;
		border: 2rpx solid #DCB490;
		padding: 21rpx 67rpx;
		color: #DCB490;
	}
</style>